{% extends "sentry/bases/account.html" %}

{% load crispy_forms_tags %}
{% load i18n %}
{% load sentry_helpers %}

{% block title %}{% trans "Notification Settings" %} | {{ block.super }}{% endblock %}

{% block main %}
    <style type="text/css">
    table label,
    table input[type=checkbox] {
        margin: 0;
    }
    table caption {
        font-weight: normal;
        text-align: left;
        font-size: 16px;
        padding-bottom: 10px;
    }
    td label small {
        font-weight: normal;
    }
    table.notifications-fine-tuning {
      margin-bottom: 20px;
    }
    table.notifications-fine-tuning > tbody > tr > td,
    table.notifications-fine-tuning > thead > tr > th {
      padding: 8px 10px;
      font-size: 14px;
    }
    table.notifications-fine-tuning > tbody > tr > td.route {
      padding: 0;
    }
    table.notifications-fine-tuning > tbody > tr > td.route .form-control {
      padding: 8px 10px;
      border: 1px solid #fff;
      border-width: 0 1px;
      box-shadow: none;
      top: 0;
      border-radius: 0;
    }
    table.notifications-fine-tuning > tbody > tr > td.route .form-control .select2-choice .select2-arrow {
      right: -3px;
    }
    table.notifications-fine-tuning > tbody > tr > td.route .form-control .select2-choice > .select2-chosen {
      margin-right: 20px;
    }
    table.notifications-fine-tuning > tbody > tr > td.route .form-control.select2-dropdown-open {
      border-color: #c9c0d1;
    }
    td .form-group { margin-bottom: 0; }
    </style>
    <form action="" method="post" class="">
        {% csrf_token %}

        <h4>{% trans "Alerts" %}</h4>

        <p>Alerts are generated based on a project's rules, defined in <strong>[Project] &raquo; Project Settings &raquo; Alerts &raquo; Rules</strong>.</p>

        {{ settings_form.subscribe_by_default|as_crispy_field }}

        <hr />

        <h4>{% trans "Workflow" %}</h4>

        <p>
          {% blocktrans %}
            Workflow notifications are separate from alerts and are generated
            for issue updates, such as changes in issue assignment, changes to
            resolution status (including regressions), and comments.
          {% endblocktrans %}
        </p>
        <p>
          {% blocktrans %}
            When workflow notifications are enabled for a project, you'll
            receive an email when your teammates perform any of these actions.
            You'll be automatically added as a participant on an issue by
            taking one of the actions listed above. You may subscribe (or
            unsubscribe) from individual issues on their respective pages.
          {% endblocktrans %}
        </p>

        {{ settings_form.workflow_notifications|as_crispy_field }}

        {{ settings_form.self_assign_issue|as_crispy_field }}

        {{ settings_form.self_notifications|as_crispy_field }}

        <hr />

        <h4>{% trans "Weekly Reports" %}</h4>

        <p>{% blocktrans %}Reports contain a summary of what's happened within your organization over the last week.{% endblocktrans %}</p>

        {{ reports_form.organizations|as_crispy_field }}

        <hr />

        {% if org_forms %}
          <h4>{% trans "Deploys" %}</h4>

          <p>{% blocktrans %}Deploy emails include release, environment and commit overviews. Choose to receive emails for:{% endblocktrans %}</p>

          {% for org, form in org_forms %}
              {{ form|as_crispy_errors }}
          {% endfor %}

          {% for org, form in org_forms %}
            <div class="deploy-form">
                <h5>{{org.name}}</h5>
                {{ form.notifications|as_crispy_field }}
            </div>
          {% endfor %}

          <hr />
        {% endif %}

        <h4>{% trans "Fine Tuning" %}</h4>

        <p>Use the settings below to fine tune notification settings per-project. You may add or verify additional email addresses via the <a href="{% url "sentry-account-settings-emails" %}">Emails</a> settings.</p>

        {% for project, form in project_forms %}
            {{ form|as_crispy_errors }}
        {% endfor %}

        {% for project, form in project_forms %}
            {% ifchanged project.organization %}
                {% if not forloop.first %}
                    </table>
                {% endif %}

                <table class="table notifications-fine-tuning">
                    <thead>
                        <tr>
                            <th>{% trans "Project" %}</th>
                            <th style="width:300px;overflow:hidden;text-align:right">
                              {% trans "Email Address" %}
                            </th>
                            <th style="width:50px;text-align:center">
                              <a data-toggle="alert">Alerts</a>
                            </th>
                            <th style="width:50px;text-align:center">
                              {% trans "Workflow" %}
                            </th>
                        </tr>
                    </thead>
                    <tbody>
            {% endifchanged %}
            <tr>
              <td>
                <a href="{% absolute_uri '/{}/{}/settings/alerts/' project.organization.slug project.slug %}">{{ project.organization.slug}} / {{ project.slug }}</a>
              </td>
              <td style="text-align:right" class="route">
              {% with form.email as field %}
                {{ field|as_crispy_field }}
              {% endwith %}
              </td>
              <td style="text-align:center">{{ form.alert }}</td>
              <td style="text-align:center">{{ form.workflow }}</td>
            </tr>
        {% endfor %}
        </tbody></table>

        {% for form in ext_forms %}
            <h4>{{ form.get_title }}</h4>
            {% with form.get_description as description %}
                {% if description %}
                    {{ description|linebreaks }}
                {% endif %}
            {% endwith %}
            {% include "sentry/partial/form_base.html" %}
        {% endfor %}

        {% block hosted_notifications %}
        {% endblock %}

        <fieldset class="form-actions">
            <button type="submit" class="btn btn-primary">{% trans "Save Changes" %}</button>
        </fieldset>
    </form>
    <script>
    $(function() {
  function findCheckboxes(parent, match) {
    return $(parent)
      .parents('table')
      .find('tbody input[type="checkbox"]')
      .filter(function() {
        return this.name.indexOf(match) !== -1;
      });
  }

  function setupChecker(pattern) {
    $('form a[data-toggle="' + pattern + '"]')
      .click(function(e) {
        var checked = $(this).data('checked');
        findCheckboxes(this, pattern).prop('checked', !checked);
        $(this).data('checked', !checked);
      })
      .each(function() {
        var boxes = findCheckboxes(this, pattern);
        var checkedBoxes = boxes.filter(function() {
          return $(this).is(':checked');
        });
        var defaultChecked = boxes.length === checkedBoxes.length;
        $(this).data('checked', defaultChecked);
      });
  }

  setupChecker('alert');
});
</script>
{% endblock %}
